<template>
  <el-dialog
      v-model="diaVisible"
      title="报表"
      :close-on-click-modal="false"
      :append-to-body="true"
      width="90%"
      @close="resetForm"
  >
    <base-table :pagination="pagination">
      <el-table :data="tableData" stripe border
                :cell-style="{ textAlign: 'center' }"
                :header-cell-style="{ textAlign: 'center' }"
                header-row-class-name="headerRow"
                :row-class-name="tableRowClassName"
                class="lamp-table-status"
                style="width: 100%; max-height: 400px; overflow: auto">
        <el-table-column type="index" width="150" label="序号" #default="scope">
          {{ scope.$index < 9 ? '0' + (scope.$index + 1) : scope.$index + 1 }}
        </el-table-column>
        <el-table-column prop="inspectionGateway" label="网关名" width="300" />
        <el-table-column prop="inspectionLight" label="巡检灯具" width="160" />
        <el-table-column prop="inspectionResult" label="巡检结果" />
        <el-table-column prop="createTime" label="巡检时间" width="220" />
      </el-table>
    </base-table>
    <template #footer>
      <div class="dialog-footer">
        <div @click="resetForm" class="cancel-btn">取消</div>
      </div>
    </template>
  </el-dialog>
</template>

<script>
import {changeBuildingLocaitonUi, inspectionLogsSecond} from "../../../router/api.js";
import BaseTable from "../../../components/baseTable.vue";
export default {
  name: "inspectionReportTable",
  components: {BaseTable},
  data(){
    return {
      diaVisible: false,
      pagination: {
        page: 1,
        size: 999,
        total: 0,
      },
      tableData: [],
    }
  },

  methods: {
    async show(val, row){
      this.tableData = []
      this.diaVisible = true;
      let res = await inspectionLogsSecond({gatewayName: val, inspectionTimesUuid: row.inspectionTimesUuid});
      if (res.data.code == 200) {
        if ( res.data.data && res.data.data.length) {
          this.tableData = res.data.data;
          this.pagination.total = 0//res.data.data.length;
        }
      } else {
        this.tableData = [];
        this.pagination.total = 0;
        // this.$message.warning(res.data.msg)
      }
    },
    tableRowClassName({row, rowIndex}) {
      if (row.inspectionLight.indexOf('异常') > -1) {
        return 'danger-row';
      } else if (row.inspectionLight.indexOf('警告') > -1) {
        return 'warning-row';
      }
      return '';
    },
    resetForm(){
      this.diaVisible = false;
      this.tableData = []
    }
  }
}
</script>

<style scoped lang="scss">

</style>
<style lang="scss" scope>
.lamp-table-status{
  .warning-row {
    background: yellow;
  }
  .danger-row {
    background: red;
  }
  .el-table__body tr.el-table__row--striped td.el-table__cell{
    background: transparent;
  }
}
</style>

